/**
 * Created by Galois on 2017/7/4.
 */
/*jquery提供的浏览器通用的初始化方法，在页面加载完成时触发*/

    var loading = false;
    getContent();   //列表页面加载,从json拿到数据填充到页面,试水微信头像和个性签名部分

    function getData(result) {
        if(result.status==200){
            return result.data;
        }else{
            alert(result.messages||"获取信息错误");
            return null;
        }
    }

    function getContent(){
        if(loading) return;
        loading = true;
        /*获取列表*/
            $.post("PersonalJson/index.action",function (result, err) {
            var items = getData(result);
            appendContent(items);

            $(document).ready(function(e) {
                /*在dom元素加载完毕后立即执行，注意只是dom元素，这里只写函数内部代码也行*/
                console.log("unslider执行");
                var unslider04 = $('#b04').unslider({
                        dots: true
                    }),
                    data04 = unslider04.data('unslider');

                /*$('.unslider-arrow04').click(function() {
                 var fn = this.className.split(' ')[1];
                 data04[fn]();
                 });*/
            });

        })
    }
    /*把获取到的列表信息填充入#List中*/
    function appendContent(items){
        var contentHeader;
        var contentFooter;
        var listContentHeader=[];
        var listContentFooter=[];
        items.forEach(function(itemHeader){
            /*header头部部分*/
            listContentHeader.push('<div class="header">');
            listContentHeader.push('      <div class="header_content">');
            listContentHeader.push('          <div class="touxiang">');
            listContentHeader.push('              <img src="'+ itemHeader.icon +'" alt="" id="pic">');
            listContentHeader.push('          </div>');
            listContentHeader.push('          <ul> ');
            listContentHeader.push('              <li>'+ itemHeader.name +'</li>');
            listContentHeader.push('              <li>'+ itemHeader.signature +'</li>');
            listContentHeader.push('          </ul>');
            listContentHeader.push('      </div><!--header_content结束-->');
            listContentHeader.push('</div><!--header结束-->');

            /*nav导航部分    style="background-color: '+ itemHeader.color+'"*/
            listContentHeader.push('<div class="nav '+ itemHeader.mycolor +'">');
            listContentHeader.push('    <div class="nav_content">');
            listContentHeader.push('        <ul>');
            listContentHeader.push('            <li><a href="index.html">首页</a></li>');
            listContentHeader.push('            <li><a href="front.html">成功案例</a></li>');
            listContentHeader.push('            <li><a href="admin.html">成员介绍</a></li>');
            listContentHeader.push('            <li><a href="article.html">文章动态</a></li>');
/*            listContentHeader.push('            <li><a href="https://github.com/GaloisLYJ" target="_blank">github</a></li>');*/
            listContentHeader.push('            <li><a href="company.html" target="_blank">公司主页</a></li>');
            listContentHeader.push('            <li><a href="knowMore.html" target="_blank">联系我们</a></li>');
            listContentHeader.push('        </ul>');
            listContentHeader.push('    </div><!--nav_content结束-->');
            listContentHeader.push('</div><!--nav结束-->');

            listContentHeader.push('<div class="banner" id="b04">');
            listContentHeader.push('    <ul>');                                                                             /*javascript:window.location.href=\'' + itemHeader.link[0] + '\' link为index.html的写法*/
            listContentHeader.push('        <li><a href="'+ itemHeader.carouselhref1 +' "><img src="'+ itemHeader.pic1 +'" title="'+ itemHeader.title1 +'" alt="" width="1300" height="300"></a></li>');
            listContentHeader.push('        <li><a href="'+ itemHeader.carouselhref2 +' "><img src="'+ itemHeader.pic2 +'" title="'+ itemHeader.title2 +'" alt="" width="1300" height="300"></a></li>');
            listContentHeader.push('        <li><a href="'+ itemHeader.carouselHref3 +' "><img src="'+ itemHeader.pic3 +'" title="'+ itemHeader.title3 +'" alt="" width="1300" height="300"></a></li>');
            listContentHeader.push('        <li><a href="'+ itemHeader.carouselHref4 +' "><img src="'+ itemHeader.pic4 +'" title="'+ itemHeader.title4 +'" alt="" width="1300" height="300"></a></li>');
            listContentHeader.push('        <li><a href="'+ itemHeader.carouselHref5 +' "><img src="'+ itemHeader.pic5 +'" title="'+ itemHeader.title5 +'" alt="" width="1300" height="300"></a></li>');
            listContentHeader.push('    </ul>');
            listContentHeader.push('</div>');
        });
        contentHeader = listContentHeader.join("");                 //  连成一句话
        $("#contentHeader").append(contentHeader);

        /*页面尾部部分style="background-color:'+ itemFooter.color +'"*/
        items.forEach(function (itemFooter) {
            listContentFooter.push('<div class="footer '+ itemFooter.mycolor +'">');
            listContentFooter.push('    <div class="footer_content">');
            listContentFooter.push('        <ul>');
            listContentFooter.push('            <li>www.l-yj.cn/pms_shuzi&nbsp;&nbsp;&nbsp;粤ICP备3115004235号&nbsp;&nbsp;&nbsp;广州天河广工大龙洞校区(510520)</li>');
            listContentFooter.push('            <li><a href="'+ itemFooter.homepage + '" target="_blank">我的主页</a></li>');
            listContentFooter.push('            <li>欢迎关注企业公众号：</li>');
            listContentFooter.push('        </ul>');
            listContentFooter.push('        <div class="yujian"><a href=""><img src="images/publicNum.jpg"></a></div>');
            listContentFooter.push('    </div>');
            listContentFooter.push('</div>');
        });
        contentFooter = listContentFooter.join("");
        $("#contentFooter").append(contentFooter);
        loading = false;     //加载完毕
    }
    /*以下两句是调试js代码加载顺序情况的语句,
     发现控制轮播图执行的js代码虽然在按顺序写在append函数后面，
     但是执行有同时进行的部分
     需要在调用append函数的后面调用轮播图js才行。
     var first = $("#b04").html();
     console.log(first);*/

